// pages/identify/identify.js
Page({

    /**
     * 页面的初始数据
     */
    data: {
        screenInfo: {}
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        console.log(options)
        let name = options.name,
            number = options.number,
            productionTime = options.productionTime
        this.getScreenInfo()
        this.initCanvas(name,number,productionTime)
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {

    },
    //获取设备信息
    getScreenInfo: function () {
        let screenInfo = wx.getSystemInfoSync();
        console.log(screenInfo)
        this.setData({
            screenInfo: screenInfo
        })
    },
    // 初始化canvas
    initCanvas: function (name,number,productionTime) {
        let that = this,
            width = that.data.screenInfo.screenWidth * 0.9,
            height = that.data.screenInfo.screenHeight * 0.8,
            bgImg = {}, // 背景图
            brandImg = {},//下方商标,
            title = {},//标题
            brandName = {},// 第一行 标题
            brandBatch = {},// 第二行 产品批次
            brandDate = {},// 第三行 生产日期
            brandNumber = {},// 第四行 海关编号
            ctx = wx.createCanvasContext('pathCanvas');
        console.log(ctx)
        bgImg = {
            url: 'http://47.105.41.175:8090/upload/images/t/t100.png',
            dx: 0,
            dy: 0,
            x: width,
            y: height
        }
        title = {
           content:'天 开 智 慧 教 育 信 息 咨 询 有 限 公 司',
            dy:height * 0.22,
            dx:width * 0.5
        }
        brandName = {
            left:{
                content:'产 品 名 称 :',
                dy:height * 0.4,
                dx:width * 0.35
            },
            right:{
                content:'天开智慧记',
                dy:height * 0.4,
                dx:width * 0.63
            }
        }
        brandBatch = {
            left:{
                content:'产 品 批 次 :',
                dy:height * 0.5,
                dx:width * 0.35
            },
            right:{
                content:name,
                dy:height * 0.5,
                dx:width * 0.63
            }
        }
        brandDate =  {
            left:{
                content:'海 关 编 号 :' ,
                dy:height * 0.6,
                dx:width * 0.35
            },
            right:{
                content: number,
                dy:height * 0.6,
                dx:width * 0.63
            }
        }
        brandNumber =  {
            left:{
                content:'产 品 日 期 :',
                dy:height * 0.7,
                dx:width * 0.35
            },
            right:{
                content:productionTime,
                dy:height * 0.7,
                dx:width * 0.65
            }
        }
        brandImg={
            url:'http://47.105.41.175:8090/upload/images/t/t101.png',
            dx:width*0.20,
            dy:height * 0.73,
            x:width * 0.6,
            y:height * 0.2
        }
        that.backImage(ctx,bgImg,title,brandName,brandBatch,brandDate,brandNumber,brandImg)
    },
    /**
     *绘制
     * */
    backImage: function (ctx, bgImage,title,brandName,brandBatch,brandDate,brandNumber,brandImg) {
        let that = this;
        console.log(bgImage)
        wx.getImageInfo({
            src: bgImage.url,
            success: res => {
                console.log(res)
                ctx.drawImage(res.path, bgImage.dx, bgImage.dy, bgImage.x, bgImage.y)
                ctx.setTextAlign('center')
                ctx.setFillStyle('#456361')
                ctx.font = "bold " + '20' + "px SimHei"
                ctx.fillText(title.content,title.dx,title.dy,that.data.screenInfo.screenWidth * 0.7)

                ctx.setFillStyle('#3b6479')
                ctx.font = "normal " + '16' + "px SimHei"
                ctx.fillText(brandName.left.content,brandName.left.dx,brandName.left.dy)
                ctx.fillText(brandName.right.content,brandName.right.dx,brandName.right.dy)

                ctx.fillText(brandBatch.left.content,brandBatch.left.dx,brandBatch.left.dy)
                ctx.fillText(brandBatch.right.content,brandBatch.right.dx,brandBatch.right.dy)

                ctx.fillText(brandDate.left.content,brandDate.left.dx,brandDate.left.dy)
                ctx.fillText(brandDate.right.content,brandDate.right.dx,brandDate.right.dy)

                ctx.fillText(brandNumber.left.content,brandNumber.left.dx,brandNumber.left.dy)
                ctx.fillText(brandNumber.right.content,brandNumber.right.dx,brandNumber.right.dy)


                wx.getImageInfo({
                    src:brandImg.url,
                    success:data=>{
                        ctx.drawImage(data.path, brandImg.dx, brandImg.dy, brandImg.x, brandImg.y)
                        ctx.draw()
                    }
                })

            },
            fail:err=>{
                console.log(err)
            }
        });
    },
    bindbang:function () {
        wx.navigateTo({
          url: '../bangding/bangding'
        })
    }
})